<!--20210304    zaq    创建vue文件-->
<!--20210520    zaq    完善界面-->



<template>
<!--新增一个账簿-->
  <div>
    <el-form ref="book" v-model="book" label-width="80px">
      <el-form-item label="账簿名称:">
        <el-input v-model="book.bName"
                  maxlength="10"
                  show-word-limit
        ></el-input>
      </el-form-item>

      <el-form-item label="账簿类型:"
                    v-loading="loading"
                    element-loading-text="拼命加载中"
                    element-loading-spinner="el-icon-loading"
                    element-loading-background="rgba(0, 0, 0, 0.8)"
      >
        <el-select v-model="book.bKind" placeholder="请选择账簿类型">
          <el-option v-for="kind in kindBooks"
                     :key="kind.kBId"
                     :label="kind.name"
                     :value="kind.kBId"
          ></el-option>
        </el-select>
      </el-form-item>
      <el-form-item>
        <el-button @click="submit('book')">立即创建</el-button>
        <el-button>重置</el-button>
      </el-form-item>

    </el-form>

    <!--    成功信息对话框-->
    <el-dialog
        title="提示"
        v-model="successDialog.visible"
        width="30%"
        :before-close="handleClose">

      <el-result icon="success" title="新建账簿成功" :subTitle="successDialog.message"/>

      <template #footer>
        <span class="dialog-footer">
          <el-button type="primary" @click="goto">确 定</el-button>
        </span>
      </template>
    </el-dialog>

    <!--    失败信息对话框-->
    <el-dialog
        title="提示"
        v-model="failDialog.visible"
        width="30%"
        :before-close="handleClose">

      <el-result icon="error" title="新建账簿失败" :subTitle="failDialog.message"/>

      <template #footer>
        <span class="dialog-footer">
          <el-button @click="failDialog.visible = false">取 消</el-button>
          <el-button type="primary" @click="failDialog.visible = false">确 定</el-button>
        </span>
      </template>
    </el-dialog>

  </div>
</template>

<script>
import {getKindBook_0000} from "../../api";
import { ElMessage } from 'element-plus';
import {insert_12101} from "../../api";

export default {
  name: "Input_book",
  methods:{
    //成功后跳转
    goto(){
      location.reload()
    },
    //重置
    reset(){
      this.book.bName=null
      this.book.bKind=null
    },
    //新增账簿
    submit(){
      //检查数据合法性
      const _this=this
      var book=this.book
      if(book.bName==null||book.bName.trim()==""){
        ElMessage.error('账簿名称不能为空' );
      }else if(book.bKind==null){
        ElMessage.error('账簿类型不能为空' );
      }else{
        var uId=sessionStorage.getItem("uId")
        console.log("uid1:"+uId)
        book.uId=uId
        insert_12101(book).then(resp=>{
          if(resp.code>0){
            //弹出成功提示
            _this.successDialog.message=resp.note;
            _this.successDialog.visible=true;
          }else {
            //弹出失败信息
            _this.failDialog.message=resp.note;
            _this.failDialog.visible=true;
          }
        }).catch(error=>{
          ElMessage.error('调用接口12201失败：' + error);
        })
      }
    },
    handleClose(done) {
      this.$confirm('确认关闭？')
          .then(_ => {
            done();
          })
          .catch(_ => {

          });
    },
    //获取账簿类型
    getBookKind(){
      const _this=this
      var body={
        code:-1,
        note:"",
        kBId:-1,
        name:"aa",
        flagGroup:0,
        delete:0
      }
      console.log("获取账簿类型")
      _this.loading=true
      getKindBook_0000(body).then(resp=>{
        _this.kindBooks=resp
        console.log("获取账簿类型成功")
      }).catch(error=>{
        ElMessage.error('调用接口获取账簿类型失败：' + error);

        console.log("获取账簿类型失败")
      })
      _this.loading=false
    }
  },
  data(){
    return{
      //账簿类型加载
      loading:false,
      // 成功信息
      successDialog:{
        visible:false,
        message:'',
      },
      // 失败信息
      failDialog:{
        visible:false,
        message:'',
      },
      //账簿信息
      book:{
        code:-1,
        note:"",
        bId:-1,
        bName:"",//账簿名
        bCreatedate:0,
        bDefault:0,
        delete:0,
        uId:-1,
        bKind:null,
        flagGroup:false,//有无组别
        bookUpdate:false,//账簿信息修改弹框
        selectDrawer: false,//查询收支信息drawer
      },
      //账簿类型
      kindBooks:null,
    }
  },
  created() {
    this.getBookKind()
  },
}
</script>

<style scoped>

</style>